<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:h="http://java.sun.com/jsf/html"  
      xmlns:f="http://java.sun.com/jsf/core"  
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:t="http://myfaces.apache.org/tomahawk">  

    <ui:composition>
        <t:dataTable id="tblPupilCourse" value="#{coursePupilBean.pageData}" var="cursor" styleClass="table table-hover"
                     preserveSort="true" rows="10" sortColumn="#{coursePupilBean.sort}" sortAscending="#{coursePupilBean.sortAscending}"
                     rowIndexVar="rowIndex" >
            <t:column>
                <f:facet name="header">
                </f:facet>
                <t:selectOneRow groupName="selectRadioGroup1" />
            </t:column>
            <t:column>
                <f:facet name="header">
                    <t:commandSortHeader columnName="ui.id" arrow="true" styleClass="sortColumn">
                        <h:outputText value="ID"/>
                    </t:commandSortHeader>
                </f:facet>
                <h:outputText value="#{cursor.ui.id}">
                </h:outputText>
            </t:column>
            <t:column>
                <f:facet name="header">
                </f:facet>
                <t:outputText value="#{(coursePupilBean.targetPage-1)*coursePupilBean.maximumPageSize +rowIndex+1}"/>
            </t:column>
            <t:column>
                <f:facet name="header">
                    <t:commandSortHeader columnName="ui.firstName" arrow="true" styleClass="sortColumn">
                        <h:outputText value="Họ và tên"/>
                    </t:commandSortHeader>
                </f:facet>
                <h:outputText value="#{cursor.ui.lastName}"/><h:outputText value=" "/>
                <h:outputText value="#{cursor.ui.firstName}"/>  
            </t:column>
            <t:column>
                <f:facet name="header">
                    <t:commandSortHeader columnName="ui.mobile" arrow="true" styleClass="sortColumn">
                        <h:outputText value="SĐT"/>
                    </t:commandSortHeader>
                </f:facet>
                <h:outputText value="#{cursor.ui.mobile}"/> 
            </t:column>
            <t:column>
                <f:facet name="header">
                    <h:outputText value="T"/><h:outputText value="${courseManageBean.indexMonth1}"/>
                </f:facet>
                <i class="icon-ok-sign"></i>
            </t:column>
            <t:column>
                <f:facet name="header">
                    <h:outputText value="T"/><h:outputText value="${courseManageBean.indexMonth2}"/>
                </f:facet>
                <i class="icon-ok-sign"></i>
            </t:column>
            <t:column>
                <f:facet name="header">
                    <h:outputText value="T"/><h:outputText value="${courseManageBean.indexMonth3}"/>
                </f:facet>
                <i class="icon-ok-sign"></i>
            </t:column>
            <t:column>
                <f:facet name="header">
                    <h:outputText value="T"/><h:outputText value="${courseManageBean.indexMonth4}"/>
                </f:facet>
                <i class="icon-ok-sign"></i>
            </t:column>
            <t:column>
                <f:facet name="header">
                    <h:outputText value="T"/><h:outputText value="${courseManageBean.indexMonth5}"/>
                </f:facet>
                <i class="icon-ok-sign"></i>
            </t:column>
            <t:column>
                <f:facet name="header">
                    <h:outputText value="T"/><h:outputText value="${courseManageBean.indexMonth6}"/>
                </f:facet>
                <i class="icon-ok-sign"></i>
            </t:column>
            <f:facet name="footer">
                <div class="row">
                    <div class="span6" style="padding-left: 30px">
                        <t:div styleClass="pagination pagination-left">
                            <ul>
                                <li>
                                    <t:commandLink  value="Thêm Học Sinh" action="#{coursePupilBean.preAddPupilToCourse}"/>
                                </li>
                                <li>
                                    <t:commandLink  value="Đóng Học Phí" action="#{coursePupilBean.editPupilCourse}"/>
                                </li>
                                <li>
                                    <t:commandLink  value="Chuyển Lớp" action="#{coursePupilBean.selectPupilCourse}"/>
                                </li>
                                <li>
                                    <t:commandLink  value="Print" action="#{coursePupilBean.print}"/>
                                </li>
                            </ul>
                        </t:div>
                    </div>
                    <div class="span6">

                        <t:div styleClass="pagination pagination-right">
                            <ul>

                                <li>
                                    <t:commandLink  value="Previous"
                                                    disabled="#{!coursePupilBean.hasPreviousPage}"
                                                    action="#{coursePupilBean.previousPage}"/>
                                </li>

                                <li>
                                    <t:commandLink  value="Next"
                                                    disabled="#{!coursePupilBean.hasNextPage}"
                                                    action="#{coursePupilBean.nextPage}" />
                                </li>
                                <li class="active"> <a href="#"><t:outputText value="#{coursePupilBean.rowCount} row(s)"/></a>
                                </li>
                            </ul>
                        </t:div>

                    </div>
                </div>
            </f:facet>
        </t:dataTable>
    </ui:composition>        

</html>  